import React from 'react';
import { Container, Paper, Typography, Button } from '@mui/material';
import { CheckCircle, Cancel } from '@material-ui/icons';
import { useNavigate, useLocation } from 'react-router-dom';
import './submitResult.css';

export default function SubmitResult() {
  const navigate = useNavigate();
  const location = useLocation();
  const isSuccess = location.state?.success ?? false;

  const handleButtonClick = () => {
    if (isSuccess) {
      navigate('/');
    } else {
      navigate(-1);
    }
  };

  return (
    <Container maxWidth="sm" className="submitResultContainer">
      <Paper elevation={3} className="submitResultPaper">
        {isSuccess ? (
          <>
            <div className="resultIcon success">
              <CheckCircle />
            </div>
            <Typography variant="h4" className="resultTitle success">
              Submission Successful
            </Typography>
            <Typography variant="body1" className="resultMessage">
              Your business application has been submitted successfully.
              Our team will review your application and contact you soon.
            </Typography>
            <div className="progressSteps">
              <div className="step completed">
                <div className="stepDot"></div>
                <Typography variant="body2">Application Submitted</Typography>
              </div>
              <div className="stepLine"></div>
              <div className="step inProgress">
                <div className="stepDot"></div>
                <Typography variant="body2">Under Review</Typography>
              </div>
            </div>
            <Button
              variant="contained"
              color="primary"
              onClick={handleButtonClick}
              className="resultButton"
            >
              Return to Home
            </Button>
          </>
        ) : (
          <>
            <div className="resultIcon error">
              <Cancel />
            </div>
            <Typography variant="h4" className="resultTitle error">
              Submission Failed
            </Typography>
            <Typography variant="body1" className="resultMessage">
              Sorry, there was an error submitting your application.
              Please try again or contact support if the problem persists.
            </Typography>
            <Button
              variant="contained"
              color="primary"
              onClick={handleButtonClick}
              className="resultButton"
            >
              Back to Form
            </Button>
          </>
        )}
      </Paper>
    </Container>
  );
} 